<template>
  <section class="page">
    <headerbar>{{title}}</headerbar>

    <section class="inner-content">
      <ul class="line-tab">
        <li @click="clickMenu(0)" :class="{'active':data.tabIndex==0}"><span>会议基本信息</span></li>
        <li @click="clickMenu(1)" :class="{'active':data.tabIndex==1}"><span>会议附件</span></li>
      </ul>

      <section v-if="!data.tabIndex || data.tabIndex!=1">
        <div v-if="showTypes === '2'" class="text-block">
          <div class="name color-default input-name"><i class="required color-red">*</i>类型：</div>
          <div class="value"><input readonly v-model="data.typeLabel" type="text" placeholder="请选择会议类型"></div>
        </div>
        <div v-if="showTypes === '2'" class="text-block">
          <div class="name color-default input-name"><i class="required color-red">*</i>子类型：</div>
          <div class="value"><input readonly v-model="data.subTypeLabel" type="text" placeholder="请选择子类型"></div>
        </div>
        <div v-if="showTypes !== '2'" class="text-block" @click="go('scheduleTypes')">
          <div class="name color-default input-name"><i class="required color-red">*</i>类型：</div>
          <div class="value"><input readonly v-model="data.typeLabel" type="text" placeholder="请选择会议类型"></div>
        </div>
        <div v-if="hasShyk() && showTypes !== '2'" class="text-block" @click="showSubType()">
          <div class="name color-default input-name"><i class="required color-red">*</i>子类型：</div>
          <div class="value"><input readonly v-model="data.subTypeLabel" type="text" placeholder="请选择子类型"></div>
        </div>
        <div v-if="false" class="text-block">
          <div class="name color-default input-name"><i class="required color-red">*</i>范围：</div>
          <div class="value"><input readonly type="text" placeholder="请选择范围"></div>
        </div>

        <div class="text-block">
          <div class="name color-default input-name"><i class="required color-red">*</i>主题：</div>
          <div class="value"><input type="text" placeholder="请输入主题" v-model="data.theme"></div>
        </div>
        <div class="text-block" @click="isConcentrated()">
          <div class="name color-default input-name"><i class="required color-red">*</i>学习方式：</div>
          <div class="value"><input readonly type="text" placeholder="请选择学习方式" v-model="data.concentratedLabel"></div>
        </div>
        <div v-if="false" class="text-block">
          <div class="name color-default input-name"><i class="required color-red">*</i>创建人：</div>
          <div class="value"><span class="mine-lists-content">张三</span></div>
        </div>
        <div v-if="formState == 'add'" class="text-block" @click="selectPerson('attendUserName')">
          <div class="name color-default input-name"><i class="required color-red">*</i>参与人员：</div>
          <div class="value"><input readonly type="text" placeholder="请选择参与人员" v-model="data.attendUserName"></div>
        </div>
        <div v-if="!isLessOneHour" class="text-block" @click="showTimePicker()">
          <div class="name color-default input-name"><i class="required color-red">*</i>会议开始时间：</div>
          <div class="value"><input readonly type="text" placeholder="请选择会议时间" v-model="data.meetStartTime"></div>
        </div>
        <div v-if="false" class="text-block" @click="showEndTimePicker()">
          <div class="name color-default input-name"><i class="required color-red"></i>会议结束时间：</div>
          <div class="value"><input readonly type="text" placeholder="请选择会议时间" v-model="data.meetEndTime"></div>
        </div>
        <div v-if="!isLessOneHour" class="text-block">
          <div class="name color-default input-name"><i class="required color-red">*</i>会议地点：</div>
          <div class="value"><input type="text" placeholder="请输入会议地点" v-model="data.address"></div>
        </div>
        <div class="text-block" @click="selectPerson('compereUserName')">
          <div class="name color-default input-name"><i class="required color-red">*</i>主持人：</div>
          <div class="value"><input type="text" placeholder="请输入主持人" v-model="data.compereUserName"></div>
        </div>
        <div class="text-block" @click="selectPerson('recordEUserName')">
          <div class="name color-default input-name"><i class="required color-red">*</i>记录人：</div>
          <div class="value"><input type="text" placeholder="请输入记录人" v-model="data.recordEUserName"></div>
        </div>
        <div v-if="data.concentrated==='1'" class="text-block noborder" @click="selectDuration()">
          <div class="name color-default input-name"><i class="required color-red">*</i>学习时长：</div>
          <div class="value"><input readonly type="text" placeholder="请选择学习时长" v-model="data.durationLabel"></div>
        </div>
        <template v-if="data.concentrated==='1'">
          <div class="name color-default input-name" style="margin-left: 10px"><i class="required color-red">注意：议程有学习环节时，请对应选择时长。</i></div>
          <div class="line"></div>
        </template>


        <div class="text-block">
          <!--<div class="name  color-default input-name"><i class="required color-red">*</i>会议议程：</div>
          <div class="value">
            <textarea v-model="data.agenda" placeholder="请填写会议议程" name="" id="" cols="30" rows="5"></textarea>
          </div>-->
          <div class="input-row-wrap">
            <div class="name"><i class="required color-red">*</i>会议议程：</div>
            <textarea v-model="data.agenda" placeholder="请填写会议议程" name="" id="" cols="40" rows="9"></textarea>
            <div class="name color-default input-name"><i class="required color-red">会议议程严禁录入涉密内容</i></div>
          </div>
        </div>
        <p class="pdv-10"></p>
      </section>


      <!--会议附件-->
      <section v-if="data.tabIndex==1" >
        <ul class="list-download" :refresh="downloadRefresh">
          <li class="item" v-for="(data,index) in data.oldAttachmentList" :key="data.id">
            <div class="inner">
              <div class="bd">
                <div class="title">{{data.fileName}}</div>
                <div v-if="downloadFlag" class="tip">下载中...</div>
              </div>
              <div class="ft">
                <div v-if="isImage(data.fileName)" class="btn-line pull-right" @click="imgView(data)">查看</div>
                <div v-if="!isImage(data.fileName)" class="btn-line pull-right" @click="download(data)">下载</div>
                <div class="btn-line pull-right" @click="removeOld(data,index)">删除</div>
              </div>
            </div>
          </li>
        </ul>
        <div class="mgt-10 color-tip mgb-1"><i class="required color-red">严禁上传或录入涉密内容</i></div>
<!--        原来添加会议附件-->
<!--        <div class="mgt-10 color-tip mgb-1">添加附件</div>
        <cube-upload  v-if="data.tabIndex==1 && formState=='overEdit'" ref="upload"
                     action=""
                     v-model="files"
                     accept="*/*"
                     :simultaneous-uploads="10"
                     @files-added="uploadFile"
                     @file-removed="fileRemoved"
                     @input="onInput"
        />
        <cube-upload  v-else="" ref="upload"
                     action=""
                     v-model="files"
                     accept="image/*"
                     :simultaneous-uploads="10"
                     @files-added="uploadFile"
                     @file-removed="fileRemoved"
                     @input="onInput"
        />-->
<!--        原来添加会议附件-->
        <!--现场图片-->
        <div class="mgt-5 color-tip mgb-1"></div>
        <div class="input-row-wrap">
          <div class="name">添加图片：</div>
          <div></div>
        </div>
<!--        ios的选择图片-->
        <div v-if="tools.isIos()">
          <cube-upload ref="upload"
                       action=""
                       v-model="imgFiles"
                       accept="image/*"
                       :simultaneous-uploads="1"
                       @files-added="imgUploadFile"
                       @file-removed="imgFileRemoved"
                       @input="imgOnInput"
          />
        </div>
        <div v-else >
          <cube-upload ref="upload"
                       action=""
                       v-model="imgFiles"
                       accept="mutiimage/*"
                       :simultaneous-uploads="1"
                       @files-added="imgUploadFile"
                       @file-removed="imgFileRemoved"
                       @input="imgOnInput"
          />
        </div>

        <div v-if="false" class="mgt-5 color-tip mgb-1"></div>
        <div v-if="false" class="input-row-wrap">
          <div class="name">会议记录：</div>
          <div></div>
        </div>
        <div v-if="false" class="input-row-wrap">
          <textarea placeholder="请填写会议记录" v-model="content" name="" cols="20" rows="3"></textarea>
        </div>

        <!--会议资料-->
        <div class="mgt-5 color-tip mgb-1"></div>
        <div class="input-row-wrap">
          <div class="name">其他会议资料（文件）：</div>
          <div></div>
        </div>
        <cube-upload ref="upload"
                     action=""
                     v-model="files"
                     accept="*/*"
                     :simultaneous-uploads="1"
                     @files-added="uploadFile"
                     @file-removed="fileRemoved"
                     @input="onInput"
        />
      </section>



      <div class="mgt-10"></div>
      <div @click="checkParam($event)" v-preventReClick="1000" class="default-block-btn" style="position: fixed;width: 90%;left: 5%;bottom: 20px;" v-if="formState!='overEdit'">提交</div>
      <div @click="saveMaterial($event)" v-preventReClick="1000" class="default-block-btn" v-if="data.tabIndex==1 && formState=='overEdit'">保存材料</div>
      <div class="mgt-10"></div>

    </section>
  </section>
</template>

<script>
  import tools from '@/utils/tools'
  import api from '@/common/config/api'
  import loginService from '@/service/loginService'
  import moment from 'moment'
  import fileIcon from '../../../../static/images/up_document.png'

  export default {
    name: 'organizationalLifeAdd',
    data () {
      return {
        fn: tools,
        title: "添加会议",
        formState: this.$route.params.state, //新增还是修改
        orgLifeId: null, //修改时赋值
        data: {
          type: '',
          subType: '',
          theme: '',
          typeLabel: '',
          attendUserId: '',
          attendUserName: '',
          compereUserId: '',
          compereUserName: '',
          recordEUserId: '',
          recordEUserName: '',
          address: '',
          meetStartTime: '',
          meetEndTime: '',
          subTypeLabel: '',
          tabIndex: 0,
          concentrated: '-1',
          concentratedLabel: '',
          duration: '',
          durationLabel: '',
          agenda: '',
          oldAttachmentList: [], //回显附件列表
        },
        files: [],
        durationList: [], //学习时长列表
        downloadFlag: false,
        attachmentList: [],
        showTypes: '',
        downloadRefresh: '1', //刷新附件列表
        distanceTimer: null, //获取距离会议时间定时器
        distanceTime: null, //距离会议时间
        isLessOneHour: false, //是否小于预约时间一小时
        uploadStatus: 1, //上传状态，0上传中、1全部上传完成
        imgFiles: [],
        imgAttachmentList: [],//图片列表
        imgUploadStatus: 1, //上传状态，0上传中、1全部上传完成
      }
    },
    watch: {
      /*data:{
        attendUserName: (newVal,oldVal)=>{
              this.data.compereUserName = ''
              this.data.recordEUserName = ''
           },
           deep: true
      }*/
      /*'data.attendUserName':(newVal,oldVal)=>{
        debugger
        this.data.compereUserName = ''
        this.data.recordEUserName = ''
      }*/
    },
    created () {
      console.log('当前表单是新增还是修改？',this.formState)
      let type = this.$route.params.type
      // this.data.typeLabel = this.$route.params.typeLabel
      this.loadDuration()


      if (this.showTypes === '2') {
        this.data.type = 'shyk'
        this.data.subType = '3'
        this.data.typeLabel = '三会一课'
        this.data.subTypeLabel = '党小组会'
      }

      //初始化数据
      this.init(this.formState);


      if (this.$store.state.OrgLifeAddflagType) {
        this.resetData()
        this.$store.state.OrgLifeAddflagType = false
        this.showTypes = this.$route.params.showTypes
      } else {
        this.resumeData()
      }

    },
    beforeDestroy() {
      clearInterval(this.distanceTimer);
    },
    methods: {
      // 初始化数据
      init(formState){
        if (formState=="edit") {
          this.distanceFun1(); //距离会议时间
          this.title = "修改会议";
          this.orgLifeId = this.$route.query.orgLifeId; //ID
          if (this.$store.state.organizationalLifeAddData || this.$store.state.scheduleTypeSelected) {
              this.resumeData()
          }else{
              this.loadData();
          }
        } else if (formState=="overEdit") { //会议结束后修改
          this.title = "修改会议";
          this.orgLifeId = this.$route.query.orgLifeId; //ID
          this.loadData();
        }else {
          this.title = "添加会议";
        }
      },
      // 组织生活会详情
      loadData () {
        let data = {
          loginId: '3750',
          orgLifeId: this.orgLifeId
        }
        loginService.orgLifeDetail(data).then((res) => {
          if (res.code !== 0) {
            return tools.tip(res.message)
          }
          var data = res.data;
          this.data.type = data.type; //类型
          this.data.typeLabel = data.typeName; //类型名称
          this.data.subType = data.subType; //子类型
          this.data.subTypeLabel = data.subTypeName; //子类型
          this.data.theme = data.theme; //主题
          this.data.concentrated = data.wayFlag; //学习方式
          this.data.concentratedLabel = this.returnConcentratedLabel(data.wayFlag); //学习方式名称
          // this.data.attendUserName = data.attendUserName; //参与人员
          this.data.meetStartTime = data.startTime; //会议开始时间
          this.data.meetEndTime = data.endTime; //会议结束时间
          this.data.address = data.address; //会议地点

          this.data.compereUserId = data.hosterId; //主持人ID
          this.data.compereUserName = data.hoster; //主持人
          this.data.recordEUserId = data.recorderId; //记录人ID
          this.data.recordEUserName = data.recorder; //记录人
          this.data.duration = data.duration; //学习时长
          this.data.durationLabel = data.duration + "学时"; //学习时长
          this.data.agenda = data.ext.agenda; //会议议程
        })

        let data2 = {
          loginId: '3750',
          orgInfoId: this.orgLifeId
        }
        loginService.annexList(data2).then((res) => {
          if (res.code !== 0) {
            return tools.tip(res.message)
          }
          this.data.oldAttachmentList = res.data

          if (this.formState=="overEdit") {
            this.data.tabIndex = 1
          }
        })
      },
      isImage (fileName) {
        let arrExt = fileName.split('.')
        return 'PNG,JPG,JPEG,BMP,GIF'.split(',').indexOf(arrExt[arrExt.length - 1].toUpperCase()) > -1
      },
      imgView (data) {
        let imgs = [this.showImg(data.fileId)]
        this.$createImagePreview({
          initialIndex: 0,
          imgs: imgs
        }, (h) => {
          return h('div', {
            class: {
              'image-preview-custom-header': false
            },
            slot: 'header'
          }, '')
        }).show()
      },
      showImg (fileId) {
        let fileUrl = this.tools.getImgUrl(fileId)
        return fileUrl
      },
      download (item) {
        console.log('item={}', item)
        let url = this.tools.getImgUrl(item.fileId)
        let fileName = item.fileName
        if (window.android && window.android.downloadFile) {
          window.android.downloadFile(url, fileName)
        }
      },

      // 返回学习方式名称
      returnConcentratedLabel(val){
        let concentratedLabel = {
          1: "线下",
          2: "线下",
        };
        return concentratedLabel[val];
      },
      resetData () {
        this.data = {
          type: '',
          subType: '',
          theme: '',
          typeLabel: '',
          attendUserId: '',
          attendUserName: '',
          compereUserId: '',
          compereUserName: '',
          recordEUserId: '',
          recordEUserName: '',
          address: '',
          meetStartTime: '',
          meetEndTime: '',
          subTypeLabel: '',
          tabIndex: 0,
          concentrated: '-1',
          concentratedLabel: '',
          duration: '',
          durationLabel: '',
          agenda: '',
          contents: '',
          flagType: true
        }
      },
      checkParam (e) {
        if (e.target.disabled) {
          return false
        }
        if (this.uploadStatus !== 1 || this.imgUploadStatus !== 1) { //文件未上传完
          return tools.tip('文件上传中，请稍候···')
        }
        if (this.data.type === '') {
          return tools.tip('请选择会议类型！')
        }
        if (this.hasShyk() && this.data.subType === '') {
          return tools.tip('请选择子类型！')
        }
        if (this.data.theme === '') {
          return tools.tip('会议主题不能为空！')
        }
        if (this.data.attendUserId === '' && this.formState=="add") {
          return tools.tip('请选择参与人员！')
        }
        if (this.data.meetStartTime === '') {
          return tools.tip('请选择会议开始时间！')
        }
        // if (this.data.meetEndTime === '') {
        //   return tools.tip('请选择会议结束时间！')
        // }
        if (this.data.compereUserId === '') {
          return tools.tip('请选择主持人！')
        }
        if (this.data.recordEUserId === '') {
          return tools.tip('请选择记录人！')
        }
        if (this.data.address === '') {
          return tools.tip('会议地点不能为空！')
        }
        // if (this.data.concentrated === '-1') {
        //   return tools.tip('请选择学习方式！')
        // }
        if (this.data.concentrated === '1' && this.data.durationLabel === '') {
          return tools.tip('请选择学习时长！')
        }
        if (this.data.agenda === '') {
          return tools.tip('输入会议议程！')
        }

        let _this = this
        this.$createDialog({
          type: 'confirm',
          // icon: 'cubeic-alert',
          title: '温馨提示',
          content: '确认会议信息，是否进行提交？',
          confirmBtn: {
            text: '确定',
            active: true,
            disabled: false,
            href: 'javascript:;'
          },
          cancelBtn: {
            text: '取消',
            active: false,
            disabled: false,
            href: 'javascript:;'
          },
          onConfirm: () => {
            _this.submit()
          },
          onCancel: () => {
          }
        }).show()
      },
      submit () {
        /* let addFiles = {
          addFiles: this.attachmentList
        }
        let strFiles = JSON.stringify(addFiles) */
        var oldFilesArr = [];
        if (this.data.oldAttachmentList) {
          this.data.oldAttachmentList.forEach((v,i)=>{
            var obj = {
              fileId: v.fileId,
              fileName: v.fileName,
              fileUrl: v.fileUrl,
              id: v.id,
              type: v.type,
            }
            oldFilesArr.push(obj)
          })
        }

        let filesArr = oldFilesArr.concat(this.attachmentList).concat(this.imgAttachmentList);
        let filesArrNew = JSON.parse(JSON.stringify(filesArr));
        console.log('filesArrNew',filesArrNew)
        if (this.formState=="edit") { //修改
          let data = {
            address: this.data.address,
            agenda: this.data.agenda,
            annexVoList: filesArrNew,
            /* annexVoList: [
              {
                fileId: "",
                fileName: "",
                id: "",
                type: ""
              }
            ], */
            duration: this.data.duration,
            hoster: this.data.compereUserName,
            hosterId: this.data.compereUserId,
            id: this.orgLifeId,
            recorder: this.data.recordEUserName,
            recorderId: this.data.recordEUserId,
            startTime: this.data.meetStartTime,
            subType: this.data.subType,
            summary: this.data.agenda,
            theme: this.data.theme,
            type: this.data.type
          }
          data.orgLifeId = this.orgLifeId;
          this.fetchService.meet_edit(data).then((res) => {
            if (res.code !== 0) {
              return tools.tip(res.message)
            } else {
              this.uploadStatus = 0;
              tools.tip('修改成功')
              tools.back()
            }
          })
        } else { //新增
          let data = {
            address: this.data.address, //会议地点
            agenda: this.data.agenda, //会议议程
            annexVoList: filesArrNew,
            contents: this.data.agenda, //会议内容
            duration: this.data.duration, //学习时长
            endTime: "", //结束时间
            hoster: this.data.compereUserName, //主持人
            hosterId: this.data.compereUserId, //主持人ID
            recorder: this.data.recordEUserName, //记录人
            recorderId: this.data.recordEUserId, //记录人ID
            startTime: this.data.meetStartTime, //开始时间
            subType: this.data.subType, //子类型
            summary: this.data.agenda, //会议纪要
            theme: this.data.theme, //主题
            type: this.data.type, //类型
            userIds: this.data.attendUserId, //参会人员已英文”,”隔开
            wayFlag: this.data.concentrated, //参与方式
          }
          this.fetchService.meet_launch(data).then((res) => {
            if (res.code !== 0) {
              return tools.tip(res.message)
            } else {
              // tools.tip('保存成功')
              this.uploadStatus = 0;
              this.$store.state.organizationalLifeAdd = res.data
              this.$router.replace({'name': `sendNotice`})
            }
          })
          /* let data = {
            loginId: '3750',
            orgLifeId: '',
            type: this.data.type,
            subType: this.data.subType,
            theme: this.data.theme,
            startTime: this.data.meetStartTime,
            // endTime: this.data.meetEndTime,
            address: this.data.address,
            hosterId: this.data.compereUserId,
            recorderId: this.data.recordEUserId,
            wayFlag: this.data.concentrated,
            duration: this.data.duration,
            agenda: this.data.agenda,
            userIds: this.data.attendUserId,
            annexInfo: strFiles
          } */
          /* loginService.optSaveOrgLifeV2(data).then((res) => {
            if (res.code !== 0) {
              return tools.tip(res.message)
            } else {
              // tools.tip('保存成功')
              this.$store.state.organizationalLifeAdd = res.data
              this.$router.replace({'name': `sendNotice`})
            }
          }) */
        }
      },
      // 选择会议类型
      showType () {
        this.$createActionSheet({
          title: '会议类型',
          active: 10,
          data: [
            {
              scope: 'shyk',
              content: '三会一课'
            },
            {
              scope: 'ztdr',
              content: '主题党日'
            },
            {
              scope: 'mzpy',
              content: '民主评议'
            }
          ],
          onSelect: (item, index) => {
            this.data.typeLabel = item.content
            this.data.type = item.scope
            this.$forceUpdate()
          },
          onCancel: () => {
          }
        }).show()
      },
      // 选择会议子类型
      showSubType () {
        let subTypes
        if (this.data.type.includes('mzpy') || this.data.type.includes('ztdr')) {
          subTypes = [
            {
              scope: '1',
              content: '支部党员大会'
            },
            {
              scope: '4',
              content: '党课'
            }
          ]
        } else {
          subTypes = [
            {
              scope: '1',
              content: '支部党员大会'
            },
            {
              scope: '2',
              content: '支部委员会'
            },
            {
              scope: '3',
              content: '党小组会'
            },
            {
              scope: '4',
              content: '党课'
            }
          ]
        }
        this.$createActionSheet({
          title: '会议子类型',
          active: 10,
          data: subTypes,
          onSelect: (item, index) => {
            this.data.subTypeLabel = item.content
            this.data.subType = item.scope
            this.$forceUpdate()
          },
          onCancel: () => {
          }
        }).show()
      },
      // 选择人员
      selectPerson (modelName) {
        this.storeData()
        // fromOrg表示从组织生活进入
        if (modelName === 'compereUserName' || modelName === 'recordEUserName') {
          if(this.data.attendUserName && this.data.attendUserName !='' || this.formState === 'edit'){
            return this.$router.push({path: `/personnelSelection/${modelName}`, query: {isRadio: 1, fromOrg: 1,formState:this.formState}})
          }else{
           return this.tools.tip("请先选择参与人员")
          }

        }
        this.$router.push({path: `/personnelSelection/${modelName}`, query: {fromOrg: 1}})
      },
      storeData () {
        this.$store.state.organizationalLifeAddData = this.data
      },
      clearStore () {
        delete this.$store.state.organizationalLifeAddData
      },
      resumeData () {
        if (this.$store.state.organizationalLifeAddData) {
          this.data = this.$store.state.organizationalLifeAddData
        }
        if (this.$store.state.scheduleTypeSelected) {
          let arrNames = []
          let arrKeys = []
          this.$store.state.scheduleTypeSelected.forEach((v) => {
            arrKeys.push(v.value)
            arrNames.push(v.name)
          })
          this.data.typeLabel = arrNames.join(',')
          this.data.type = arrKeys.join(',')
          console.log('------------type=', this.data.type)
        }
      },
      // 会议时间格式：2019-12-06 21:48:00 精确到分
      showTimePicker () {
        this.$createTimePicker({
          showNow: true,
          minuteStep: 1,
          delay: 1,
          min: new Date(),
          day: {
            len: 90,
            filter: ['今天', '明天'],
            format: 'M月d日'
          },
          onSelect: (selectedTime, selectedText, formatedTime) => {
            this.data.meetStartTime = moment(selectedTime).format('YYYY-MM-DD HH:mm')
            this.$forceUpdate()
          }
        }).show().setTime(parseInt(moment().format('x')))
      },
      // 会议时间格式：2019-12-06 21:48:00 精确到分
      showEndTimePicker () {
        this.$createTimePicker({
          showNow: true,
          minuteStep: 1,
          delay: 1,
          min: new Date(),
          day: {
            len: 90,
            filter: ['今天', '明天'],
            format: 'M月d日'
          },
          onSelect: (selectedTime, selectedText, formatedTime) => {
            this.data.meetEndTime = moment(selectedTime).format('YYYY-MM-DD HH:mm')
            this.$forceUpdate()
          }
        }).show().setTime(parseInt(moment().format('x')))
      },
      // 学习方式
      isConcentrated () {
        this.$createActionSheet({
          title: '学习方式',
          active: 10,
          data: [
            {
              scope: '1',
              content: '线下'
            },
            {
              scope: '2',
              content: '线上'
            }
          ],
          onSelect: (item, index) => {
            if (item.scope === '2') {
              tools.alert('目前暂时只支持线下学习方式')
            } else {
              this.data.concentratedLabel = item.content
              this.data.concentrated = item.scope
            }
            this.$forceUpdate()
          },
          onCancel: () => {
          }
        }).show()
      },
      // 选择学习时长
      selectDuration () {
        this.$createActionSheet({
          title: '选择学习时长',
          active: 10,
          data: this.durationList,
          onSelect: (item, index) => {
            this.data.durationLabel = item.content
            this.data.duration = item.scope
            this.$forceUpdate()
          },
          onCancel: () => {
          }
        }).show()
      },
      // 时长列表
      loadDuration () {
        this.durationList = []
        let data = {
          loginId: '112030'
        }
        loginService.durationList(data).then((res) => {
          if (res.code === 0) {
            res.data.map((v, i) => {
              let data = {
                scope: v.value,
                content: v.label
              }
              this.durationList.push(data)
            })
          }
        })
      },
      makeStr (arr) {
        return JSON.stringify(arr)
        let arrImg = []
        arr.forEach((v) => {
          arrImg.push(`{'fileid':'${v.fileid}', 'type':'1'}`)
        })
        return `[${arrImg.join(',')}]`
      },
      // 删除文件
      fileRemoved (file) {
        this.attachmentList.some((v, i) => {
          if (v.fileName === file.file.name && v.totalBytes === file.file.size) {
            this.attachmentList.splice(i, 1)
            return false
          }
        })
      },
      // 修改时删除材料
      removeOld (data,index) {
        let _this = this
        this.$createDialog({
          type: 'confirm',
          // icon: 'cubeic-alert',
          title: '温馨提示',
          content: '是否确认删除该材料？',
          confirmBtn: {
            text: '确定',
            active: true,
            disabled: false,
            href: 'javascript:;'
          },
          cancelBtn: {
            text: '取消',
            active: false,
            disabled: false,
            href: 'javascript:;'
          },
          onConfirm: () => {
            if (_this.formState=="overEdit") { //结束后直接调接口删除
              _this.deleteMaterial(data,index);
            }else{
              _this.data.oldAttachmentList.splice(index, 1)
              _this.downloadRefresh = new Date().getTime();
            }
          },
          onCancel: () => {
          }
        }).show()
      },
      // 删除材料接口
      deleteMaterial (item,index) {
        let data = {
          fileId: item.fileId,
          fileName: item.fileName,
          id: item.id,
          ids: item.id,
          type: item.type,
        }
        this.fetchService.meet_optDelAnnex(data).then((res) => {
          if (res.code !== 0) {
            return tools.tip(res.message)
          }
          this.data.oldAttachmentList.splice(index, 1)
          this.downloadRefresh = new Date().getTime();
        })
      },
      // 保存材料
      saveMaterial () {
        if (this.uploadStatus !== 1 || this.imgUploadStatus !== 1) { //文件未上传完
          return tools.tip('文件上传中，请稍候···')
        }
        let _this = this
        this.$createDialog({
          type: 'confirm',
          // icon: 'cubeic-alert',
          title: '温馨提示',
          content: '确认材料信息，是否进行提交？',
          confirmBtn: {
            text: '确定',
            active: true,
            disabled: false,
            href: 'javascript:;'
          },
          cancelBtn: {
            text: '取消',
            active: false,
            disabled: false,
            href: 'javascript:;'
          },
          onConfirm: () => {
            _this.saveMaterialRequest()
          },
          onCancel: () => {
          }
        }).show()
      },
      // 保存材料接口
      saveMaterialRequest () {
        let filesArr = this.attachmentList.concat(this.imgAttachmentList);
        let filesArrNew = JSON.parse(JSON.stringify(filesArr));
        console.log('filesArrNew',filesArrNew)

        let data = {
          orgLifeId: this.orgLifeId,
          annexVoList: filesArrNew,
        }
        this.fetchService.meet_optAddAnnex(data).then((res) => {
          if (res.code !== 0) {
            return tools.tip(res.message)
          }
          this.uploadStatus = 0;
          tools.tip("保存成功")
          tools.back()
        })
      },
      uploadFile (file) {
        console.log('----------name=' + file)
        var len = file.length;
        var index = 0;
        for (let i = 0; i < len; i++) {
          this.uploadStatus = 0;
          let uploadFile = file[i]
          let formData = new FormData()
          formData.append('file', uploadFile)
          loginService.o_upload(formData).then((res) => {
            if (res.code !== 0) {
              return tools.tip(res.message)
            }
            this.attachmentList.push({
              fileId: res.data.fileId,
              fileName: res.data.fileName,
              fileUrl: res.data.desc,
              id: '',
              type: '1'
            })
            index ++
            if (index == len) {
              this.uploadStatus = 1;  //全部上传完成
            }
          })
        }
        /* let uploadFile = file[0]
        let formData = new FormData()
        formData.append('file', uploadFile)
        loginService.o_upload(formData).then((res) => {
          if (res.code !== 0) {
            return tools.tip(res.message)
          }
          this.attachmentList.push({
            'fileid': res.data.fileId,
            'filename': uploadFile.name,
            'totalBytes': res.data.totalBytes,
            'type': '1'
          })
          this.attachmentList.push({
            fileId: res.data.fileId,
            fileName: uploadFile.name,
            id: '',
            type: '1'
          })
        }) */
      },
      onInput (file) {
        this.$refs.upload.files.map((v) => {
          if (!tools.isImage(v.name)) {
            v.url = fileIcon
          }
          return v
        })
      },
      // 删除文件
      imgFileRemoved (file) {
        this.imgAttachmentList.some((v, i) => {
          if (v.fileName === file.file.name && v.totalBytes === file.file.size) {
            this.imgAttachmentList.splice(i, 1)
            return false
          }
        })
      },
      imgUploadFile (file) {
        this.imgUploadStatus = 0;
        let length = file.length;
        let i = 0;
        for (let j in file) {
          let uploadFile = file[j]
          let formData = new FormData()
          formData.append('file', uploadFile)
          console.log('uploadFile.name={}', uploadFile.name)
          loginService.o_upload(formData).then((res) => {
            console.log('imguploadFile res=' + res)
            if (res.code !== 0) {
              return tools.tip(res.message)
            }
            i++;
            console.log('img i={}'+i)
            if (length === i) {
              this.imgUploadStatus = 1;
            }
            this.imgAttachmentList.push({'fileId': res.data.fileId,'fileUrl': res.data.desc, 'fileName': uploadFile.name, 'totalBytes': res.data.totalBytes, 'type': '3'})
          })
        }
      },
      imgOnInput (file) {
        this.$refs.upload.imgFiles.map((v) => {
          if (!tools.isImage(v.name)) {
            v.url = fileIcon
          }
          return v
        })
      },
      go (name) {
        this.storeData()
        this.$router.push({name: name})
      },
      hasShyk () {
        return this.data.type.indexOf('shyk') !== -1
      },
      clickMenu (current) {
        if (current==0 && this.formState=="overEdit") {
          return tools.tip('会议已结束，会议基本信息禁止修改')
        }
        this.data.tabIndex = current
      },
      // 获取距离预约时间
      distanceFun1() {
          var time1 = new Date().getTime();
          var time2 = new Date(this.data.meetStartTime).getTime();
          this.distanceTime = this.formatDuring(time2 - time1);
          console.log("距离预约时间还差多少秒", this.formatDuring(time2 - time1));

          if (this.distanceTime <= 0) {
            //已过期
            this.formState = "overEdit";
          }
          if (0 < this.distanceTime <= 3600) {
            //距离开始时间小于1小时
            this.isLessOneHour = true
          }
          if (this.distanceTime > 21600) {
            //距离开始时间大于1小时
            this.isLessOneHour = false
          }
      },
      // 定时器获取距离预约时间
      distanceFun2() {
        var _this = this;
        clearInterval(this.distanceTimer);
        this.distanceTimer = setInterval(() => {
          var time1 = new Date().getTime();
          var time2 = new Date(_this.data.meetStartTime).getTime();
          this.distanceTime = this.formatDuring(time2 - time1);
          console.log("距离预约时间还差多少秒", this.formatDuring(time2 - time1));

          if (this.distanceTime <= 0) {
            //已过期
            this.formState = "overEdit";
          }
          if (0 < this.distanceTime <= 3600) {
            //距离开始时间小于1小时
            this.isLessOneHour = true
          }
          if (this.distanceTime > 21600) {
            //距离开始时间大于1小时
            this.isLessOneHour = false
          }
        }, 1000);
      },
      //把时间转换成秒
      formatDuring(mss) {
        let seconds = parseInt(mss / 1000); // 得到秒数
        return seconds;
      },
    }
  }
</script>

<style scoped lang="scss">
@import "@/common/stylus/moon.scss";

/*文档下载*/
.list-download {
  .item {
    border-bottom: 1px solid rgba(212, 212, 212, 1);
    padding: pxToRem(30px);
    .inner {
      display: flex;
      flex-direction:row;
      justify-content:space-between;
      align-items:center;
      .bd {
        flex: 1;
        .title {
          height: auto;
          line-height: 1.2em;
          font-size: pxToRem(30px);
          font-weight: 400;
          color: rgba(51, 51, 51, 1);
          word-break: break-all;
        }
        .tip {
          color: $tip-color;
          padding-top: pxToRem(22px);
        }
      }
      .ft {
        width: pxToRem(300px);
        text-align: right;
        flex-shrink:0;
        margin-left:20px;
      }
      .btn-line {
        text-align: center;
        width: pxToRem(130px);
        margin-left: pxToRem(10px);
        height: pxToRem(60px);
        background: rgba(255, 255, 255, 1);
        border: 1px solid $theme-color;
        border-radius: pxToRem(10px);
        font-size: pxToRem(28px);
        font-weight: 400;
        color: rgba(226, 0, 1, 1);
        line-height: pxToRem(60px);
      }
    }

  }
}
</style>
